<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="utf-8">
    <title></title>
    <meta name="renderer" content="webkit">
    <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
    <meta name="viewport" content="width=device-width, initial-scale=1.0, minimum-scale=1.0, maximum-scale=1.0, user-scalable=0">
    <link rel="stylesheet" href="../plugins/layui-v2.6.8/layui/css/layui.css?v=${.Config.basic.version}" media="all">
    <link rel="stylesheet" href="../plugins/layui/css/style.css?v=${.Config.basic.version}" media="all">
    <link rel="stylesheet" href="../layuiadmin/style/admin.css?v=${.Config.basic.version}" media="all">
    <link rel="stylesheet" href="../plugins/zTree/css/metroStyle/metroStyle.css?v=${.Config.basic.version}">
    <link rel="stylesheet" href="../plugins/zTree/css/metroStyle/ext.css?v=${.Config.basic.version}">
    <link rel="stylesheet" href="//at.alicdn.com/t/c/font_3564966_a6tt4yhnzge.css" media="all">
    <link rel="stylesheet" href="../plugins/toastr/toastr.min.css?v=${.Config.basic.version}">

    <link rel="stylesheet" href="../plugins/jquery-step/jquery.step.css?v=${.Config.basic.version}" media="all">
    <!-- <style>
        .layui-table-view .layui-table td, .layui-table-view .layui-table th {
            padding: 5px 0;
            border-top: 1px solid #404453;
            border-left: 1px solid #404453;
            border-bottom: 1px solid #404453;
            border-right: 1px solid #404453;
        }
        .layui-table-cell {
            line-height: 20px !important;
            vertical-align: middle;
            height: auto;
            overflow: visible;
            text-overflow: inherit;
            white-space: normal;
        }
        .layui-table-view .layui-table[lay-size="sm"] .layui-table-cell {
            line-height: 20px !important;
            vertical-align: middle;
            height: auto;
            overflow: visible;
            text-overflow: inherit;
            white-space: normal;
        }
    </style> -->
    <style>
        .layui-form-label-lg {
            width: 150px;
        }

        .ui-step-wrap .ui-step .ui-step-item div {
            text-align: center;
            color: #899eb2;
        }
        button {
            display: inline-block;
            padding: 6px 12px;
            font-size: 14px;
            line-height: 1.42857143;
            text-align: center;
            cursor: pointer;
            border: 1px solid transparent;
            border-radius: 4px;
            color: #fff;
            background-color: #4958b9;
        }
        
        .main {
            width: 750px;
            margin: 10px auto;
        }
        
        #step {
            margin-bottom: 20px;
        }
        
        .btns {
            float: left;
        }
        
        .info {
            float: left;
            height: 34px;
            line-height: 34px;
            margin-left: 40px;
            font-size: 28px;
            font-weight: bold;
            color: #928787;
        }
        
        .info span {
            color: red;
        }
    </style>
</head>
<body>

    <div class="layui-card">
        <div class="layui-card-body">
            <form class="layui-form" lay-filter="form_search" id="form_search" action="">
                <div class="layui-form-item">


                    <div class="layui-inline">
                        <!--<label class="layui-form-label auto-size-label"></label>-->
                        <div class="layui-input-inline">
                            <input type="text" name="txt_key" placeholder="请输入关键字" lay-verify="" autocomplete="off" class="layui-input">
                        </div>
                    </div>
                    <div class="layui-inline">
                        <button type="submit" class="layui-btn layui-btn-sm layui-btn-normal" lay-submit="" lay-filter="btn_search"><i class="layui-icon layui-icon-search"></i>查询</button>
                        <!--<button type="button" class="layui-btn layui-btn-normal layui-btn-sm action-export layui-hide" lay-submit="" lay-filter="btn_search"><i class="fa fa-file-excel-o"></i> 导出</button>-->
                    </div>

                    <div class="layui-inline fr">
                        <button type="submit" class="layui-btn layui-btn-sm layui-btn-normal action-edit layui-hide" lay-submit="add" lay-filter="add">新增</button>
                    </div>

                </div>
            </form>

            <table class="layui-hide" id="table" lay-filter="table"></table>
        </div>
    </div>

    

    

<script src="../js/check_screen.js?v=${.Config.basic.version}"></script>

</body>


<script src="../plugins/jquery/jquery-3.6.0.js?v=${.Config.basic.version}"></script>
<script src="../plugins/layui-v2.6.8/layui/layui.js"></script>
<script src="../plugins/jquery.slimscroll.min.js"></script>
<script src="../plugins/toastr/toastr.min.js"></script>
<script src="../plugins/moment.min.js"></script>
<script src="../plugins/jquery-step/jquery.step.min.js?v=${.Config.basic.version}"></script>
<script src="../js/utils.js?v=${.Config.basic.version}"></script>
<script src="../js/func.js?v=${.Config.basic.version}"></script>
<script>
    var table=null;
    var form=null;
    var Table=null;
    var element = null;
    var sys_roles=null;
    var lay_index = null;
    var token = window.localStorage.getItem("token");
    var user_info=JSON.parse(window.localStorage.getItem("user_info"));
    var dictionary=JSON.parse(window.localStorage.getItem("dictionary"));
    var func_url="${.func_url}";
    var actions=[];
    token = 'Bearer ' + token;

    var $step = null;

    layui.config({
        base: '../layuiadmin/' //静态资源所在路径
    }).extend({
        index: 'lib/index' //主入口模块
    }).use(['index','layer','form', 'table','transfer','laydate','element','dropdown'],function(){

        $ = layui.$;
        form = layui.form;
        table = layui.table;
        element = layui.element;

        toastr.options = {
            "closeButton": false, //是否显示关闭按钮
            "debug": false, //是否使用debug模式
            "positionClass": "toast-top-center",//弹出窗的位置
            "showDuration": "300",//显示的动画时间
            "hideDuration": "1000",//消失的动画时间
            "timeOut": "2000", //展现时间
            "extendedTimeOut": "1000",//加长展示时间
            "showEasing": "swing",//显示时的动画缓冲方式
            "hideEasing": "linear",//消失时的动画缓冲方式
            "showMethod": "fadeIn",//显示时的动画方式
            "hideMethod": "fadeOut" //消失时的动画方式
        };

        $.ajax({
            type: 'GET',
            url: '../Api/User/Actions',
            data: {func_url:func_url},
            beforeSend: function(request) {
                request.setRequestHeader("Authorization", 'Bearer '+window.localStorage.getItem("token"));
            },
            dataType: "json",
            success: function (data) {
                console.info(data)
                actions=data.data;
                for(var i=0;i<actions.length;i++){
                    $('.action-'+actions[i].action_id).removeClass("layui-hide");
                }
            },
            error: function (XMLHttpRequest, textStatus, errorThrown) {
                layer.msg('加载操作信息失败');
            }
        });

        //监听提交
        form.on('submit(btn_search)', function(data){
            //layer.alert(JSON.stringify(data.field), {title: '最终的提交信息'})
            search({key:data.field.txt_key});
            return false;
        });

        form.on('submit(add)', function(data){
            onAdd();
            return false;
        });


        form.on('submit(btn_save)', function(data){
            console.info(data.field);

            var request_type = "PUT";
            if(data.field.id!=""){
                request_type = "PUT";
            }
            else {
                request_type = "POST";
            }

            layer.load(1);
            $.ajax({
                type: request_type,
                url:'../Api/Group',
                data: data.field,
                beforeSend: function(request) {
                    request.setRequestHeader("Authorization", 'Bearer '+window.localStorage.getItem("token"));
                },
                dataType: "json",
                success: function (res) {
                    if(res.code>=0){
                        layer.close(lay_index);
                        search();
                    }else{
                        layer.close(lay_index);
                        layer.alert(res.msg);
                        toastr.warning(res.msg);
                    }
                },
                error: function (XMLHttpRequest, textStatus, errorThrown) {
                    layer.msg('加载信息失败');
                },
                complete: function(XMLHttpRequest, textStatus) {
                    layer.closeAll('loading');
                },

            });
        });

        Table = table.render({
            elem: '#table'
            //,data:data
            ,url:'../Api/Group'
            ,height: 'full-90'
            ,method:'GET'
            ,headers : {'Authorization': 'Bearer '+window.localStorage.getItem("token")}
            ,where: {}
            // ,page: {
            //     limit:50,
            //     limits:[10, 20, 30, 40, 50,100,200,300,400],
            //     theme: '#3c7cff'
            // }
            //,limit:30
            //,toolbar: '#user_table_toolbar' //开启头部工具栏，并为其绑定左侧模板
            ,defaultToolbar: ['']
            ,title: ''
            ,even:true
            ,size: 'sm' //小尺寸的表格
            // ,skin: 'row' //无框风格
            ,cols: [[
                {field:'',title:'',type:'numbers'}
                ,{field:'id', title:'id',hide:true}
                ,{field:'group_code', title:'集团编码',sort: true}
                ,{field:'group_name', title:'集团名称',sort: true}
                ,{field:'sort_idx', title:'排序号', width:100,align:'center', sort: true}
                ,{field:'create_date', title:'创建时间', width:160,align:'center', sort: true}
                ,{field:'create_user', title:'创建人员', width:100,align:'center', sort: false}
                ,{field:'update_date', title:'更新时间', width:160,align:'center', sort: true}
                ,{field:'update_user', title:'更新人员', width:100,align:'center', sort: false}
                ,{field:'', title:'操作', width:200,sort: false,align:'left', fixed: 'right',templet: function(d) {
                    var html = "";
                    html += "<a href='#'   class=\"layui-hide action-edit\" lay-event=\"edit\"><span class=\"  text-underline\">修改</span></a><span class=\"shortGreyLine layui-hide action-delete \"></span>";
                    html += "<a href='#'   class=\"layui-hide action-delete\" lay-event=\"delete\"><span class=\"  text-underline\">删除</span></a>";
                    
                    return html;
                }}
            ]]
            ,done: function(res, curr, count){
                element.render();
                for(var i=0;i<actions.length;i++){
                    $('.action-'+actions[i].action_id).removeClass("layui-hide");
                }
            }
        });

        table.on('sort(table)', function(obj){
            for(var i=0;i<actions.length;i++){
                $('.action-'+actions[i].action_id).removeClass("layui-hide");
            }
        });

        //头工具栏事件
        table.on('toolbar(table)', function(obj){
            switch(obj.event){
                case 'add':
                    onAdd();
                    break;

                //自定义头工具栏右侧图标 - 提示
                case 'LAYTABLE_TIPS':
                    layer.alert('这是工具栏右侧自定义的一个图标按钮');
                    break;
            };
        });

        //监听行工具事件
        table.on('tool(table)', function(obj){
            var item = obj.data;
            //console.log(data)
            if(obj.event === 'edit'){
                onEdit(item);
            }
            if(obj.event === 'delete'){
                onDelete(item);
            }
        });


        

        

        //$index.text($step.getIndex());
        $("#prevBtn").on("click", function() {
            $step.prevStep();
            $index.text($step.getIndex());
        });

        $("#nextBtn").on("click", function() {
            $step.nextStep();
            $index.text($step.getIndex());
        });
    });

    function onAdd(){
        var item = {
            id:"",
            group_name:"",
            group_code:"",
            sort_idx:"0",
        };
        form.val("form",item);
        layer.open({
            //area: 'auto',
            area:['400px','450px'],
            type: 1,
            shade: 0.3,
            offset: '20%',
            shadeClose:true,
            title: '新增', //不显示标题
            content: $('#form'), //捕获的元素，注意：最好该指定的元素要存放在body最外层，否则可能被其它的相对元素所影响
            btn: ['确定', '取消']
            ,yes: function(index, layero){
                lay_index=index;
                var submit = layero.find("#btn_save");
                submit.click();
            }
        });
    }

    function onEdit(item){
        form.val("form",item);
        layer.open({
            //area: 'auto',
            area:['400px','450px'],
            type: 1,
            shade: 0.3,
            offset: '20%',
            shadeClose:true,
            title: '修改', //不显示标题
            content: $('#form'), //捕获的元素，注意：最好该指定的元素要存放在body最外层，否则可能被其它的相对元素所影响
            btn: ['确定', '取消']
            ,yes: function(index, layero){
                lay_index=index;
                var submit = layero.find("#btn_save");
                submit.click();
            }
        });
    }

    function onDelete(item) {
        layer.confirm('确认删除'+item.group_name+"?", function(index){
            //obj.del();
            layer.load(1);
            $.ajax({
                type: 'DELETE',
                url:"../Api/Group",
                data: item,
                beforeSend: function(request) {
                    request.setRequestHeader("Authorization", 'Bearer '+window.localStorage.getItem("token"));
                },
                dataType: "json",
                success: function (res) {
                    //console.info(data)
                    if(res.code==0){
                        //layer.msg('成功');
                        toastr.success('删除成功');
                        layui.table.reload('table'); //重载表格
                        layer.close(index); //再执行关闭
                    }else{
                        toastr.warning(res.msg, "异常");
                    }
                },
                error: function (XMLHttpRequest, textStatus, errorThrown) {
                    layer.alert('失败');
                },
                complete: function(XMLHttpRequest, textStatus) {
                    layer.closeAll('loading');
                },
            });
        });
    }

    function search(params) {
        Table.reload({
            where: params
        });
    }

</script>


<form class="layui-form" lay-filter="form" id="form" style="display:none;padding: 20px;">
    <div class="layui-form-item layui-hide">
        <input type="text" name="id" lay-verify="" placeholder="" autocomplete="off" class="layui-input" style="width: 100%">
    </div>
    <div class="layui-form-item">
        <label class="layui-form-label"><span class="layui-text-red">*</span> 编码</label>
        <div class="layui-input-block">
            <input type="text" name="group_code" lay-verify="required" lay-verType="tips" placeholder="" autocomplete="off" class="layui-input" style="width: 100%">
        </div>
    </div>


    <div class="layui-form-item">
        <label class="layui-form-label"><span class="layui-text-red">*</span> 名称</label>
        <div class="layui-input-block">
            <input type="text" name="group_name" lay-verify="required" lay-verType="tips" placeholder="" autocomplete="off" class="layui-input" style="width: 100%">
        </div>
    </div>

    <div class="layui-form-item">
        <label class="layui-form-label"><span class="layui-text-red">*</span> 排序号</label>
        <div class="layui-input-block">
            <input type="text" value="0" name="sort_idx" lay-verify="number" lay-verType="tips" placeholder="" autocomplete="off" class="layui-input" style="width: 100%">
        </div>
    </div>

    <div class="layui-form-item layui-hide">
        <input type="button" lay-submit lay-filter="btn_save" id="btn_save" value="确认">
    </div>
</form>
</html>